import React, { Component } from 'react';
import {
  Platform,
  StyleSheet,
  Text,
  View,
  TouchableOpacity,
} from 'react-native';
import CodePush from "react-native-code-push";

const codePushOptions = {checkFrequency : CodePush.CheckFrequency.MANUAL };



type Props = {};

class App extends Component<Props> {
  state={
      appVersion:'',
      downloadProgress:'',
      updateInfo:'点击检查',
  }
  componentDidMount() {
    this._getCurrentPackageInfo();
  }
  _getCurrentPackageInfo = async()=>{
      let appVersion='未获取';
      CodePush.getCurrentPackage().then(update=>{
          console.log(update);
          if(update && update.appVersion){
              appVersion=JSON.stringify(update);
          }
          this.setState({appVersion});
      });
  }
  _CheckUpdates = () => {
    this.setState({updateInfo:'正在检查更新...'});
    CodePush.sync( {
          installMode : CodePush.InstallMode.IMMEDIATE ,
          updateDialog : {
            appendReleaseDescription : true ,
            mandatoryContinueButtonLabel : "立即更新" ,
            mandatoryUpdateMessage : "必须更新后才能使用" ,
            optionalIgnoreButtonLabel : '稍后' ,
            optionalInstallButtonLabel : '后台加载新资源' ,
            optionalUpdateMessage : '有新版本资源了，是否更新？' ,
            title : '更新提示'
          } ,
        } ,
        (status) => {
            switch (status) {
                case CodePush.SyncStatus.DOWNLOADING_PACKAGE:
                    this.setState({updateInfo:'下载中...'});
                    console.log('downloading');
                    break;
                case CodePush.SyncStatus.INSTALLING_UPDATE:
                    this.setState({updateInfo:'下载完成...'});
                    console.log('INSTALLING');
                      // Hide "downloading" modal
                    break;
                case CodePush.SyncStatus.UP_TO_DATE :
                    this.setState({updateInfo:'已经是最新了'});
                    console.log('已经是最新了');
                    break;
                case CodePush.SyncStatus.UNKNOWN_ERROR  :
                    this.setState({updateInfo:'出错了'});
                    console.log('出错了！');
                    break;
                default:
                    console.log('默认',status);
            }
        },
        ({ receivedBytes, totalBytes, }) => {
            this.setState({downloadProgress:receivedBytes+' / '+totalBytes});
            console.log('更新中...',receivedBytes+' / '+totalBytes);
        }
    );
  }



  render() {
    return (
      <View style={styles.container}>
        <Text style={styles.welcome}>
          Welcome to React Native!
        </Text>
        <Text style={styles.instructions}>
            {this.state.downloadProgress}
        </Text>
        <Text style={styles.instructions}>
          {this.state.appVersion}
        </Text>
        <Text style={styles.instructions}>
          这是新的版本1.0.8 最新版
        </Text>
        <TouchableOpacity onPress={this._CheckUpdates}>
            <Text>{this.state.updateInfo}</Text>
        </TouchableOpacity>
      </View>
    );
  }
}

//这一行是必须的
App = CodePush( codePushOptions )( App );
export default App;

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#F5FCFF',
  },
  welcome: {
    fontSize: 20,
    textAlign: 'center',
    margin: 10,
  },
  instructions: {
    textAlign: 'center',
    color: '#333333',
    marginBottom: 15,
  },
});